@(currentPage: com.avaje.ebean.Page[Shoe], currentSortBy: String, currentOrder: String, currentFilter: String)

@****************************************
* Helper generating navigation links    *
****************************************@
    @link(newPage:Int, newSortBy:String) = @{

        var sortBy = currentSortBy
        var order = currentOrder

        if(newSortBy != null) {
            sortBy = newSortBy
            if(currentSortBy == newSortBy) {
                if(currentOrder == "asc") {
                    order = "desc"
                } else {
                    order = "asc"
                }
            } else {
                order = "asc"
            }
        }

        // Generate the link
        routes.Application.list(newPage, sortBy, order, currentFilter)

    }

        @**********************************
        * Helper generating table headers *
        ***********************************@
    @header(key:String, title:String) = {
        <th class="@key.replace(".","_") header @if(currentSortBy == key) @{if(currentOrder == "asc") "headerSortDown" else "headerSortUp"}">
            <a href="@link(0, key)">@title</a>
        </th>
    }

@main {

    <h1 id="homeTitle">@Messages("shoes.list.title", currentPage.getTotalRowCount)</h1>

    @if(flash.containsKey("success")) {
        <div class="alert-message warning">
            <strong>Done!</strong> @flash.get("success")
        </div>
    }

    <div id="actions">

        <form action="@link(0, "name")" method="GET">
            <input type="search" id="searchbox" name="f" value="@currentFilter" placeholder="Filter by computer name...">
            <input type="submit" id="searchsubmit" value="Filter by name" class="btn primary">
        </form>

        <a class="btn success" id="add">Add a new computer</a>
        @*href="@routes.Application.create()"*@
    </div>

    @if(currentPage.getTotalRowCount == 0) {

        <div class="well">
            <em>Nothing to display</em>
        </div>

    } else {

        <table class="shoes zebra-striped">
            <thead>
                <tr>
                    @header("name", "Shoe name")
                    @header("introduced", "Introduced")
                    @header("discontinued", "Discontinued")
                    @header("brands.name", "Brand")
                </tr>
            </thead>
            <tbody>

            </tbody>
        </table>

        <div id="pagination" class="pagination">
            <ul>
                @if(currentPage.hasPrev) {
                    <li class="prev">
                        <a href="@link(currentPage.getPageIndex - 1, null)">&larr; Previous</a>
                    </li>
                } else {
                    <li class="prev disabled">
                        <a>&larr; Previous</a>
                    </li>
                }
                <li class="current">
                    <a>Displaying @currentPage.getDisplayXtoYofZ(" to "," of ")</a>
                </li>
                @if(currentPage.hasNext) {
                    <li class="next">
                        <a href="@link(currentPage.getPageIndex + 1, null)">Next &rarr;</a>
                    </li>
                } else {
                    <li class="next disabled">
                        <a>Next &rarr;</a>
                    </li>
                }
            </ul>
        </div>

    }

}

            